<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:composite="http://java.sun.com/jsf/composite"
	xmlns:common="http://java.sun.com/jsf/composite/common">

<composite:interface>
	<composite:attribute name="tiposMaterial" />
	<composite:attribute name="tipoMaterialSeleccionado" />
	<composite:attribute name="item" />
	<composite:attribute name="muestraDialogListner"
		method-signature="void signature()" />
	<composite:attribute name="parentId" />
	<composite:attribute name="readOnly" default="false" />
	<composite:attribute name="chooseItem" default="true"></composite:attribute>
	<composite:attribute name="container" />
	<composite:attribute name="isModal" default="true" />
	<composite:attribute name="newCreatedItem" default="false" />

	<composite:editableValueHolder name="articulo" targets="articulo"></composite:editableValueHolder>
</composite:interface>

<composite:implementation>
	<!-- ITEM -->
	<div id="#{cc.id}">
		<p:messages id="itemDataGrwol" globalOnly="true" showDetail="true"
			showSummary="true" />
		<p:accordionPanel id="#{cc.attrs.container}">
			<p:tab id="itemsDataPanel" title="Datos del Item">
				<p:selectOneRadio id="pesoEspesorRadio"
					value="#{itemsMB.pesoEspesorOption}" layout="custom">
					<f:selectItem itemLabel="" itemValue="1" />
					<f:selectItem itemLabel="" itemValue="2" />
					<p:ajax update="espesor peso"
						listener="#{itemsMB.pesoEspesorChanged}" />
				</p:selectOneRadio>
				<p:panelGrid style="margin-bottom:10px;">
					<p:row>
						<!-- ARTICULO -->
						<p:column>
							<h:outputLabel for="articulo" value="Articulo" />
						</p:column>
						<p:column>
							<p:inputText id="articulo" maxlength="10"
								value="#{cc.attrs.item.codigo}" readonly="#{cc.attrs.readOnly}"
								disabled="#{cc.attrs.newCreatedItem}" label="Articulo"
								required="true" />
							<h:inputHidden rendered="#{cc.attrs.readOnly}"
								value="#{cc.attrs.item.codigo}" required="#{cc.attrs.readOnly}"
								id="articulo_h" />
							<p:commandButton type="button"
								rendered="#{cc.attrs.readOnly and cc.attrs.chooseItem}"
								title="Buscar Articulo" styleClass="searchButton"
								icon="ui-icon-search" onclick="itemDialog.show()"
								update="itemDialog" />
						</p:column>
						<p:column>
							<p:message showDetail="false" id="articulo_message"
								for="#{!cc.attrs.readOnly ? 'articulo' : 'articulo_h'}" />
						</p:column>


						<!-- TIPO DE PRODUCTO -->
						<p:column>
							<h:outputLabel for="tipo" value="Tipo de producto" />
						</p:column>
						<p:column>
							<p:inputText id="tipo" maxlength="10"
								value="#{cc.attrs.item.itemTipo.descripcion}"
								readonly="#{cc.attrs.readOnly}" rendered="#{cc.attrs.readOnly}" />
							<p:selectOneMenu readonly="#{cc.attrs.readOnly}"
								rendered="#{!cc.attrs.readOnly}" id="tipoProd"
								value="#{cc.attrs.item.itemTipo.descripcion}"
								style="min-width: 190px;" required="true">
								<f:selectItems value="#{itemsMB.tiposProd}" var="tipoProd"
									itemLabel="#{tipoProd}" itemValue="#{tipoProd}" />
							</p:selectOneMenu>
							<h:inputHidden rendered="#{cc.attrs.readOnly}" id="tipo_h"
								value="#{cc.attrs.item.itemTipo.descripcion}"
								required="#{cc.attrs.readOnly}" />
						</p:column>
						<p:column>
							<p:message showDetail="false" id="tipo_message"
								for="#{!cc.attrs.readOnly ? 'tipoProd' : 'tipo_h'}" />
						</p:column>
					</p:row>
					<p:row>
						<!-- ANCHO -->
						<p:column>
							<h:outputLabel for="ancho" value="Ancho" />
						</p:column>
						<p:column>
							<p:inputText id="ancho" maxlength="10"
								value="#{cc.attrs.item.ancho}" required="true"
								readonly="#{cc.attrs.readOnly}">
								<f:validateDoubleRange minimum="0.1"
									disabled="#{cc.attrs.readOnly}" />
							</p:inputText>
							<h:inputHidden rendered="#{cc.attrs.readOnly}"
								value="#{cc.attrs.item.ancho}" id="ancho_h"
								required="#{cc.attrs.readOnly}">
								<f:validateDoubleRange minimum="0.1"
									disabled="#{cc.attrs.readOnly}" />
							</h:inputHidden>
						</p:column>
						<p:column>
							<p:message id="ancho_message"
								for="#{!cc.attrs.readOnly ? 'ancho' : 'ancho_h'}"
								showDetail="false" />
						</p:column>

						<!-- LARGO  -->
						<p:column>
							<h:outputLabel for="largo" value="Largo" />
						</p:column>
						<p:column>
							<p:inputText id="largo" maxlength="10"
								value="#{cc.attrs.item.largo}" readonly="#{cc.attrs.readOnly}"
								required="true">
								<f:validateDoubleRange minimum="0.1"
									disabled="#{cc.attrs.readOnly}" />
							</p:inputText>
							<h:inputHidden rendered="#{cc.attrs.readOnly}" id="largo_h"
								value="#{cc.attrs.item.largo}" required="#{cc.attrs.readOnly}">
								<f:validateDoubleRange minimum="0.1"
									disabled="#{cc.attrs.readOnly}" />
							</h:inputHidden>
						</p:column>
						<p:column>
							<p:message id="largo_message"
								for="#{!cc.attrs.readOnly ? 'largo' : 'largo_h'}"
								showDetail="false" />
						</p:column>
					</p:row>
					<p:row>
						<!-- ESPESOR  -->
						<p:column>
							<p:radioButton id="opt1" for="pesoEspesorRadio" itemIndex="0"
								rendered="#{!cc.attrs.readOnly}" style="margin-right:10px;" />
							<h:outputLabel for="espesor" id="espesorLabel" value="Espesor" />
						</p:column>
						<p:column>
							<h:inputHidden rendered="#{cc.attrs.readOnly}" id="espesor_h"
								value="#{cc.attrs.item.espesor}" required="#{cc.attrs.readOnly}">
								<f:validateDoubleRange minimum="0.0"
									disabled="#{cc.attrs.readOnly}" />
							</h:inputHidden>
							<p:inputText id="espesor" label="Espesor" maxlength="10"
								value="#{cc.attrs.item.espesor}" readonly="#{cc.attrs.readOnly}"
								disabled="#{itemsMB.pesoEspesorOption == 2}" required="true"
								styleClass="pull-left">
								<f:validateDoubleRange minimum="0.0"
									disabled="#{cc.attrs.readOnly}" />
							</p:inputText>
							<p:outputLabel style="margin-left:10px;" value="&#181;"></p:outputLabel>
						</p:column>
						<p:column>
							<p:message id="espesor_message"
								for="#{!cc.attrs.readOnly ? 'espesor' : 'espesor_h'}"
								showDetail="false" />
						</p:column>
						<!-- PESO  -->
						<p:column>
							<p:radioButton id="opt2" for="pesoEspesorRadio" itemIndex="1"
								rendered="#{!cc.attrs.readOnly}" style="margin-right:10px;" />
							<h:outputLabel for="peso" id="pesoLabel" value="Peso" />
						</p:column>
						<p:column>
							<p:inputText id="peso" label="Peso" maxlength="10"
								value="#{cc.attrs.item.peso}" readonly="#{cc.attrs.readOnly}"
								disabled="#{itemsMB.pesoEspesorOption == 1}" required="true">
								<f:validateDoubleRange minimum="0.0"
									disabled="#{cc.attrs.readOnly}" />
							</p:inputText>
							<h:inputHidden rendered="#{cc.attrs.readOnly}" id="peso_h"
								value="#{cc.attrs.item.peso}" required="#{cc.attrs.readOnly}">
								<f:validateDoubleRange minimum="0.0"
									disabled="#{cc.attrs.readOnly}" />
							</h:inputHidden>
						</p:column>
						<p:column>
							<p:message id="peso_message"
								for="#{!cc.attrs.readOnly ? 'peso' : 'peso_h'}"
								showDetail="false" />
						</p:column>
					</p:row>

					<p:row>
						<!-- MUESTRA -->
						<p:column>
							<h:outputLabel id="muestraLabel" for="archivo" value="Muestra" />
						</p:column>
						<p:column id="muestraPanel">
							<p:inputText id="archivo" label="Muestra"
								value="#{cc.attrs.item.muestraBean}" readonly="true" />
							<p:commandButton type="button" title="Save"
								styleClass="searchButton" icon="ui-icon-search"
								onclick="muestraDialog.show()" update="muestraDialog"
								rendered="#{!cc.attrs.readOnly}" />
							<h:inputHidden id="archivo_h"
								value="#{cc.attrs.item.muestraBean.name}"
								required="#{!cc.attrs.readOnly}"
								rendered="#{!cc.attrs.readOnly}" />
						</p:column>
						<p:column>
							<p:message id="archivo_message" for="archivo_h"
								rendered="#{!cc.attrs.readOnly}" showDetail="false" />
						</p:column>

						<!-- COLOR -->
						<p:column>
							<h:outputLabel for="color" id="colorLabel" value="Color" />
						</p:column>
						<p:column id="colorInput">
							<p:inputText id="color" value="#{cc.attrs.item.colorBean.nombre}"
								label="Color" readonly="true" />
							<p:commandButton type="button" title="Buscar color"
								styleClass="searchButton" icon="ui-icon-search"
								onclick="colorDialog.show()" update="colorDialog"
								rendered="#{!cc.attrs.readOnly}" />
							<h:inputHidden rendered="#{!cc.attrs.readOnly}" id="color_h"
								value="#{cc.attrs.item.colorBean.nombre}"
								required="#{!cc.attrs.readOnly}" />
						</p:column>
						<p:column>
							<p:message id="color_message" for="color_h"
								rendered="#{!cc.attrs.readOnly}" showDetail="false" />
						</p:column>
					</p:row>
					<p:row>
						<!-- TIPO DE MATERIAL -->
						<p:column>
							<h:outputLabel for="materialTipo" value="Tipo Material" />
						</p:column>
						<p:column>
							<p:selectOneMenu readonly="#{cc.attrs.readOnly}"
								id="materialTipo" style="min-width: 190px;"
								value="#{cc.attrs.tipoMaterialSeleccionado}" required="true"
								disabled="#{cc.attrs.readOnly}">
								<f:selectItems value="#{cc.attrs.tiposMaterial}" var="tipo"
									itemLabel="#{tipo.nombre}" itemValue="#{tipo}" />
							</p:selectOneMenu>
						</p:column>
						<p:column>
							<p:message id="tipoMat_message" for="materialTipo"
								showDetail="false" />
						</p:column>
					</p:row>
				</p:panelGrid>
			</p:tab>
			<p:tab id="printPanel" title="Datos de impresion">
				<p:panelGrid id="impresionPanelId">
					<p:row rendered="#{!cc.attrs.readOnly}">
						<p:column>
							<h:outputLabel value="Impresion" style="font-weight: bold;"></h:outputLabel>
						</p:column>
						<p:column>
							<p:selectBooleanCheckbox value="#{cc.attrs.item.impresion}">
								<p:ajax update="impresionPanelId" />
							</p:selectBooleanCheckbox>
						</p:column>
					</p:row>
					<p:row>
						<!-- TEXTO -->
						<p:column>
							<h:outputLabel for="text" value="Texto" />
						</p:column>
						<p:column colspan="2">
							<p:inputText id="text" maxlength="150"
								value="#{cc.attrs.item.depItemPrintSpec.text}"
								readonly="#{!cc.attrs.item.impresion}" label="Texto" />
						</p:column>

						<!-- CANT COLORES  -->
						<p:column>
							<h:outputLabel for="cantColor" id="cantColoresLabel"
								value="Cant. Colores" />
						</p:column>
						<p:column>
							<p:inputText id="cantColor" maxlength="150"
								value="#{cc.attrs.item.depItemPrintSpec.cantColor}"
								readonly="#{!cc.attrs.item.impresion}" label="cantColoresLabel"
								required="true" />
						</p:column>
						<p:column>
							<p:outputPanel rendered="#{cc.attrs.item.impresion}">
								<p:message showDetail="false" id="cantColor_message"
									for="cantColor" />
							</p:outputPanel>
						</p:column>
					</p:row>
					<p:row>
						<!-- FRENTE -->
						<p:column>
							<h:outputLabel for="frente" value="Frente" />
						</p:column>
						<p:column colspan="2">
							<p:selectBooleanCheckbox id="frente"
								value="#{cc.attrs.item.depItemPrintSpec.frente}"
								disabled="#{!cc.attrs.item.impresion}">
							</p:selectBooleanCheckbox>
						</p:column>

						<!--DORSO  -->
						<p:column>
							<h:outputLabel for="dorso" value="Dorso" />
						</p:column>
						<p:column colspan="2">
							<p:selectBooleanCheckbox id="dorso"
								value="#{cc.attrs.item.depItemPrintSpec.dorso}"
								disabled="#{!cc.attrs.item.impresion}">
							</p:selectBooleanCheckbox>
						</p:column>
					</p:row>
					<p:row>
						<!-- CILINDRO -->
						<p:column>
							<h:outputLabel for="cilindro" value="Cilindro" />
						</p:column>
						<p:column>
							<p:inputText id="cilindro"
								value="#{cc.attrs.item.depItemPrintSpec.cilindro}"
								readonly="#{!cc.attrs.item.impresion}" label="cilindro"
								required="true">
							</p:inputText>
						</p:column>
						<p:column>
							<p:outputPanel rendered="#{cc.attrs.item.impresion}">
								<p:message showDetail="false" id="cilindro_message"
									for="cilindro" />
							</p:outputPanel>
						</p:column>
					</p:row>
				</p:panelGrid>
			</p:tab>
			<p:tab title="Descripción">
				<p:panelGrid>
					<p:row>
						<!-- DESCRIPCION -->
						<p:column>
							<p:inputTextarea id="itemDescription"
								value="#{cc.attrs.item.descripcion}" rows="2" counter="counter"
								maxlength="100" cols="100"
								counterTemplate="{0} caracteres restantes." style="width: 100%;"
								readonly="#{cc.attrs.readOnly}" />
							<h:outputText id="counter" style="margin-bottom:10px;"
								rendered="#{!cc.attrs.readOnly}" />
						</p:column>
					</p:row>
				</p:panelGrid>
			</p:tab>
		</p:accordionPanel>
	</div>
	<p:dialog id="muestraDialogID" widgetVar="muestraDialog"
		modal="#{cc.attrs.isModal}" header="Eliga una muestra"
		showEffect="clip" hideEffect="clip" rendered="#{!cc.attrs.readOnly}">
		<p:ajax event="close" listener="#{cc.attrs.muestraDialogListner}"
			update=":#{cc.attrs.parentId}:#{cc.id}:#{cc.attrs.container}:archivo :#{cc.attrs.parentId}:#{cc.id}:#{cc.attrs.container}:archivo_h :#{cc.attrs.parentId}:#{cc.id}:itemDataGrwol" />
		<common:muestras oncomplete="muestraDialog.hide();" />
	</p:dialog>
	<p:dialog id="colorDialogID" widgetVar="colorDialog"
		header="Eliga un color" showEffect="clip" hideEffect="clip">
		<p:ajax event="close"
			update=":#{cc.attrs.parentId}:#{cc.id}:#{cc.attrs.container}:color :#{cc.attrs.parentId}:#{cc.id}:#{cc.attrs.container}:color_h"></p:ajax>
		<common:colors returnAction="#{itemsMB.getResultColor}"
			oncomplete="colorDialog.hide();" />
	</p:dialog>

</composite:implementation>

</html>